<template>
  <el-container>
    <el-main>
      <el-table :data="tableValue" height="600px" style="width: 100%">
        <el-table-column prop="objectName" label="Table表名" width="90"/>
        <el-table-column prop="indexName" label="索引名" width="90"/>
        <el-table-column :sortable="$store.state.TableIndexSort" prop="avgTimerWait" label="平均响应时间(皮秒)" width="100"/>
        <el-table-column :sortable="$store.state.TableIndexSort" prop="sumTimerWait" label="总响应时间(皮秒)" width="100"/>
        <el-table-column :sortable="$store.state.TableIndexSort" prop="minTimerWait" label="最小响应时间(皮秒)" width="100"/>
        <el-table-column :sortable="$store.state.TableIndexSort" prop="maxTimerWait" label="最长响应时间(皮秒)" width="100"/>
        <el-table-column :sortable="$store.state.TableIndexSort" prop="avgTimerWait" label="平均响应时间(皮秒)" width="100"/>
        <el-table-column label="逻辑I/O">
          <el-table-column :sortable="$store.state.TableIndexSort" prop="countStar" label="总次数" width="80"/>
          <el-table-column :sortable="$store.state.TableIndexSort" prop="countRead" label="Read次数" width="80"/>
          <el-table-column :sortable="$store.state.TableIndexSort" prop="countFetch" label="Fetch次数" width="80"/>
          <el-table-column :sortable="$store.state.TableIndexSort" prop="countInsert" label="Insert次数" width="80"/>
          <el-table-column :sortable="$store.state.TableIndexSort" prop="countDelete" label="Delete次数" width="80"/>
          <el-table-column :sortable="$store.state.TableIndexSort" prop="countUpdate" label="Update次数" width="90"/>
        </el-table-column>
      </el-table>
    </el-main>
  </el-container>
</template>

<script>
import {useStore} from 'vuex';
import {computed} from "vue";

export default {
  name: "TableIndexes",

  setup() {
    const store = useStore();

    const tableValue = computed(() => store.state.selectTableIndex);

    store.commit('setToggleHead', 'DB');

    return {
      tableValue,
    }
  }
}
</script>

<style scoped>

</style>